<template>
  <div class="issue">
    <div class="header">
      <van-icon
        name="arrow-left"
        @click="
          () => {
            this.$router.go(-1);
          }
        "
      />
      <li>发布动态</li>
      <span></span>
    </div>
    <main>
      <div class="text">
        <li>动态文案</li>
        <van-field
          v-model="message"
          rows="2"
          autosize
          type="textarea"
          placeholder="请输入留言"
          show-word-limit
          class="textarea"
        />
      </div>
      <div class="issueimg">
        <li>动态图片</li>
        <van-uploader v-model="fileList" multiple />
      </div>
    </main>
    <div class="foot">
      <button @click="addHouse">发布</button>
    </div>
  </div>
</template>

<script>
import axios from "../../util/axios";
export default {
  data() {
    return {
      fileList: [],
      message: "",
    };
  },
  created() {},
  methods: {
    addHouse() {
      axios.post("/addMarket", {
        name: "聚划算",
        userImg:
          "https://img0.baidu.com/it/u=3155998395,3600507640&fm=26&fmt=auto&gp=0.jpg",
        title: this.message,
        img: this.fileList.forEach((v) => v.url),
        date: new Date().toLocaleDateString(),
      });
      this.$router.push("/realmarket");
    },
  },
};
</script>

<style scoped lang="scss">
.issue {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.header {
  width: 100%;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 10px;
  background: cornflowerblue;
  color: #fff;
  font-size: 16px;
}
main {
  width: 100%;
  flex: 1;
  .text {
    width: 100%;
    padding: 0 10px;
    > li {
      width: 100%;
      height: 45px;
      display: flex;
      align-items: center;
      font-size: 16px;
    }
    .textarea {
      height: 100px;
      border: 1px solid #ccc;
    }
  }
  .issueimg {
    width: 100%;
    padding: 0 10px;
    margin-top: 10px;
    > li {
      width: 100%;
      height: 45px;
      display: flex;
      align-items: center;
      font-size: 16px;
    }
  }
}
.foot {
  width: 100%;
  height: 50px;
  button {
    width: 100%;
    height: 100%;
    border: none;
    outline: none;
    background: cornflowerblue;
    color: #fff;
    font-size: 16px;
  }
}
</style>